 <!DOCTYPE html>
 <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
        <style>
            *{
                margin: 0px;
                padding: 0px;
                list-style:none;
            }
            .header{
                height: 74px;
                background: url('images/bg.jpg') repeat-x;
            }
            .banner{
                height: 426px;
                background:#dddddd;
                border-bottom:1px solid white;
            }
            .con{
                width: 968px;
                height: 377px;
                background:white;
                margin:47px auto 31px;
            }
            .footer{
                height: 50px;
                width: 968px;
                margin:0px auto;
                background:white;
                border-top: 1px solid #dddddd;
            }
            .nav{
                width: 958px;
                height:74px ;
                margin:0px auto
            }
            .wrap{
                width: 958px;
                height:426px ;
                margin:0px auto
            }
            .wrap .left{
                float: left;
            }
            .wrap .right{
                float: right;;
            }
            .left h4{
                font-size: 45px;
                margin-top: 10px;
            }
            .left .list li{
                font-size: 18px;
                margin-top: 3px;
            }
            .nav h1{
                float: left;
            }
            .nav ul {
                float: right;
            }
            .nav li{
               float: left; 
            }
            .nav img{
                height: 45px;
                margin-top: 15px;
            }
            .nav li{
                padding:10px 11px;
                margin-right: 2px;
                margin-top:22px;
                cursor:pointer;
            }
            .nav li:hover{
                border-radius: 20px;
                background:linear-gradient(#3a3a3a,#090909)
            }
            .nav a{
                font-size: 14px;
                font-weight: bold;
                text-decoration: none;
                color:white;
            }
             .wrap h4{
                 margin-top:57px;
                 margin-bottom: 12px;
             }
             .wrap .list li{
                 line-height: 30px;
             }
             .wrap .cc li{
                line-height: 25px;
             }
             .wrap .cc a{
                 text-decoration: none;
                 font-size: 14px;   
             }
             .con .left{
                 float: left;
             }
             .con .right{
                 float: right;
             }
             .con .left li{
                 float: left;
                 width: 220px;
             }
             .con .left .last{
                 width: 192px;
             }
             .footer .left{
                 float: left;
             }
             .footer .right{
                 float: right;
             }
             .footer .bottom{
                 width:968px;
                 float: left;
             }
             .wx .dot {
    		float: left;
   			display: block;
   			margin: 10px 11px 0 0;
    		height: 6px;
    		width: 6px;
    		border-radius: 5px;
    		background-color: #999;
			}
        </style>
    </head>
    <body>
        <div class="header">
            <div class="nav">
                <h1>
                    <a href="">
                        <img src="images/log.png" alt="">
                    </a>
                </h1>
                <ul>
                    <li>
                        <a href="">
                            首页
                        </a>
                    </li>
                    <li>
                        <a href="">
                            帮助与反馈
                        </a>
                    </li>
                    <li>
                        <a href="">
                            公共平台
                        </a>
                    </li><li>
                        <a href="">
                            开放平台
                        </a>
                    </li><li>
                        <a href="">
                            微信支付
                        </a>
                    </li><li>
                        <a href="">
                            微信广告
                        </a>
                    </li><li>
                        <a href="">
                            企业微信
                        </a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="banner">
            <div class="wrap">
                <div class="left">
                    <h4>微信，是一个生活方式</h4>
                    <ul class="list">
                        <li>微信，是一个生活方式</li>
                        <li>超过十亿人使用的手机应用</li>
                        <li>支持发送语音短信、视频、图片和文字</li>
                    </ul>
                    <img src="images/down.png" alt="">
                    <ul class="cc">
                        <li>
                            <a href="">
                                忘记了微信帐号或密码？
                            </a>
                        </li>
                        <li>
                            <a href="">
                                自助解除登录或功能限制
                            </a>
                        </li>
                        <li>
                            <a href="">
                                超过十亿人使用的手机应用
                            </a>
                        </li>
                    </ul>
                </div>
                <img src="images/com.png" alt="" class="right">
            </div>
        </div>
        <div class="con">
            <div class="left">
                <img src="images/list.png" alt="">
                <ul>
                    <li>
                        <h6>微信网页版</h6>
                        <p>扫一扫二维码</p>
                        <p>就能在浏览器上使用微信</p>
                        <a href="">了解更多</a>
                    </li>
                    <li>
                        <h6>微信网页版</h6>
                        <p>扫一扫二维码</p>
                        <p>就能在浏览器上使用微信</p>
                        <a href="">了解更多</a>
                    </li>
                    <li class="last">
                        <h6>微信网页版</h6>
                        <p>扫一扫二维码</p>
                        <p>就能在浏览器上使用微信</p>
                        <a href="">了解更多</a>
                    </li>
                </ul>
            </div>
            <div class="right">
                <h2>最新消息</h2>
					<ul class="wx">
						<a>
							<span class="dot"></span>
							<a href="" target="_blank">微信 8.0.2 for Android 正式版发布</a>
						</a>
					</ul>
					<ul class="wx">
						<a>
							<span class="dot"></span>
							<a href="" target="_blank">微信 3.2.1 for Windows 正式版发布</a>
						</a>
					</ul>
					<ul class="wx">
						<a>
							<span class="dot"></span>
							<a href="" target="_blank">微信 8.0.2 for iOS 正式版发布</a>
						</a>
					</ul>
					<ul class="wx">
						<a>
							<span class="dot"></span>
							<a href="" target="_blank">微信 2.6.1 for Mac 正式版发布</a>
						</a>
					</ul>
					<ul class="wx">
						<a>
							<span class="dot"></span>
							<a href="" target="_blank">关于部分 iOS 9 用户无法更新微信</a>
						</a>
					</ul>
					<ul class="wx">
						<a>
							<span class="dot"></span>
							<a href="" target="_blank">微信外部链接内容管理规范</a>
						</a>
					</ul>
					<ul class="wx">
						<a>
							<span class="dot"></span>
							<a href="" target="_blank">微信网页版 2.1 版本发布</a>
						</a>
					</ul>
					<ul class="wx">
						<a>
							<span class="dot"></span>
							<a href="" target="_blank">微信表情开放平台上线</a>
						</a>
					</ul>
					<ul class="wx">
						<a>
							<span class="dot"></span>
							<a href="" target="_blank">官方辟谣公众号开通</a>
						</a>
					</ul>
					<p class="wo"><a href="">查看更多</a></p>
            </div>
        </div>
        <div class="footer">
            <p class="left">关于腾讯 | 服务条款 | 使用规范 | 客服中心 | 隐私保护指引</p>
            <p class="right">简体中文 | 繁体中文 | Englis</p>
            <p class="bottom">© 1998 - 2021 Tencent Inc.All Rights Reserved</p>
        </div>
    </body>
 </html>